<!DOCTYPE html>

<html>
    <head>
        <meta charset="UTF-8">
        <title>我是新窗口</title>
    </head>
    <body>
        <h3>我是新窗口</h3>
        <div class="wrapper">
            <button class="first">移动一段距离</button>
            <button class="second">移动到指定位置</button>
            <button class="third">按照给定尺寸缩小或放大窗口</button>
            <button class="fourth">将窗口大小修改为指定尺寸</button>
            <button class="fifth">刷新当前窗口</button>
            <button class="sixth">关闭当前窗口</button>
        </div>
        <script>
            (function(){

                window.addEventListener('load', function(evt){
                    console.log( evt.type, evt.target );
                }, false);

                var firstButton = document.querySelector('.first');
                firstButton.addEventListener('click', function(evt){
                    console.log( evt.target );
                    // 第一个参数表示水平方向，第二个参数表示垂直方向
                    moveBy( 50, 10 );
                },false);

                var secondButton = document.querySelector('.second');
                secondButton.addEventListener('click', function(evt){
                    console.log( evt.target );
                    // 第一个参数表示水平方向，第二个参数表示垂直方向
                    moveTo( 500, 300 );
                },false);

                var thirdButton = document.querySelector('.third');
                thirdButton.addEventListener('click', function(evt){
                    console.log( evt.target );
                    // 第一个参数表示水平方向，第二个参数表示垂直方向
                    resizeBy( 50, 25 );
                },false);

                var fourthButton = document.querySelector('.fourth');
                fourthButton.addEventListener('click', function(evt){
                    console.log( evt.target );
                    // 第一个参数表示水平方向，第二个参数表示垂直方向
                    resizeTo( 500, 500 );
                },false);

                var fifthButton = document.querySelector('.fifth');
                fifthButton.addEventListener('click', function(evt){
                    console.log( evt.target );
                    // 通过 location 实例实现 页面刷新操作
                    location.reload();
                },false);

                var sixthButton = document.querySelector('.sixth');
                sixthButton.addEventListener('click', function(evt){
                    console.log( evt.target );
                    close();
                },false);
            })();
        </script>
    </body>
</html>